import 'package:flutter/material.dart';
import 'package:xws/models/goods/goods_obj.dart';
import 'package:xws/state/user_state.dart';
import 'package:xws/utils/data_util.dart';
import 'package:xws/utils/theme_util.dart';
import 'package:xws/widgets/app_btn.dart';
import 'package:xws/widgets/app_img.dart';

/// 物品项
class MyGoodsItem extends StatelessWidget {
  const MyGoodsItem({
    Key? key,
    required this.index,
    required this.goods,
    this.onTap,
    this.onDel,
  }) : super(key: key);

  final int index;
  final GoodsObj goods;

  final void Function()? onTap;
  final void Function()? onDel;

  @override
  Widget build(BuildContext context) {
    return AppBtn.noPadding(
      onTap: () => onTap?.call(),
      child: Stack(
        children: <Widget>[
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              Expanded(
                child: Stack(
                  alignment: Alignment.topRight,
                  children: <Widget>[
                    _buildImg,
                    if (onDel != null)
                      Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: AppBtn.noPadding(
                          onTap: () => onDel?.call(),
                          width: 20,
                          height: 20,
                          radius: 10,
                          child: Icon(
                            Icons.close_rounded,
                            size: 12,
                            color: white(context),
                          ),
                          alignment: Alignment.center,
                          color: red(context),
                          border: Border.all(color: white(context)),
                        ),
                      ),
                  ],
                ),
              ),
              Padding(
                padding: const EdgeInsets.all(8.0).copyWith(bottom: 0),
                child: Text(
                  goods.description,
                  maxLines: 1,
                  overflow: TextOverflow.ellipsis,
                  style: TextStyle(
                    fontSize: 14,
                    color: black(context),
                  ),
                ),
              ),
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Row(
                  children: <Widget>[
                    _buildLable(goods.city, theme(context)),
                    const SizedBox(width: 4),
                    _buildLable(getQualityValue(goods.age), theme2(context)),
                  ],
                ),
              ),
              Padding(
                padding: const EdgeInsets.all(8.0).copyWith(top: 0),
                child: Text(
                  commentDate(goods.createdAt),
                  style: TextStyle(
                    fontSize: 10,
                    color: black(context).withOpacity(0.4),
                  ),
                ),
              ),
            ],
          ),
          _buildStatus(context),
        ],
      ),
      color: white(context),
      clipBehavior: Clip.antiAlias,
      radius: 10,
    );
  }

  Widget get _buildImg {
    return AppImg.fitCover(
      url: goods.photoUrlList.first,
      width: sw - 50,
      height: 100,
    );
  }

  Widget _buildLable(String content, Color color) {
    return Container(
      height: 18,
      child: Text(
        content,
        style: TextStyle(
          color: color.withOpacity(0.8),
          fontSize: 10,
          fontWeight: FontWeight.bold,
          height: 1.2,
        ),
      ),
      alignment: Alignment.center,
      padding: const EdgeInsets.symmetric(horizontal: 5),
      decoration: BoxDecoration(
        color: color.withOpacity(0.1),
        borderRadius: BorderRadius.circular(2),
      ),
    );
  }

  /// 构建物品状态
  Widget _buildStatus(BuildContext context) {
    if (goods.status == GoodsStatus.SHOWING) return const SizedBox.shrink();

    if (goods.toUserId == us.info.id) return _buildStatusCircle('已获得', theme(context).withOpacity(0.2));

    return _buildStatusCircle('已送出', black(context).withOpacity(0.1));
  }

  Widget _buildStatusCircle(String text, Color color) {
    return Positioned(
      bottom: -8,
      right: -8,
      child: Transform.rotate(
        angle: -0.8,
        child: Container(
          width: 70,
          height: 70,
          alignment: Alignment.center,
          child: Text(
            text,
            style: TextStyle(
              fontSize: 16,
              fontWeight: FontWeight.w900,
              color: color,
            ),
          ),
          decoration: BoxDecoration(
            shape: BoxShape.circle,
            border: Border.all(color: color, width: 5),
          ),
        ),
      ),
    );
  }
}
